<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<HEAD>
<meta http-equiv="content-type" content="text/html; charset=latin9"/>
<TITLE>Mapnik map with live rendered tiles</TITLE>
<style type="text/css">
html,body {
  background-color: #ffffff;
  height: 100%;
  width: 100%;
  margin: 0; padding: 0;
  font-family: Helvetica,Arial,sans-serif;
  overflow: hidden;
  color: #000000;
}

div#map {
  height: 100%;
  width: 100%;
  background-color:white;
}

div#permalink {
  position:absolute;
  top: 25px;
  left: 80px;
  height: 30px;
  width: 400px;
  z-index:4;
}
</style>
                                

<script type="text/javascript" src="http://openlayers.org/api/OpenLayers.js"></script>
 
<script type="text/javascript">
//<![CDATA[


var map;

function drawmap() {

    OpenLayers.Lang.setCode('de');

    var lon = 11.19815;
    var lat = 49.25059;
    var zoom = 6;

    var proj4326 = new OpenLayers.Projection("EPSG:4326");
    var projmerc = new OpenLayers.Projection("EPSG:900913");
    

    map = new OpenLayers.Map('map', {
        projection: new OpenLayers.Projection("EPSG:900913"),
        displayProjection: new OpenLayers.Projection("EPSG:4326"),
        controls: [
            new OpenLayers.Control.Navigation(),
            new OpenLayers.Control.PanZoomBar(),
            new OpenLayers.Control.Permalink(),
            new OpenLayers.Control.Attribution()],
        maxExtent: new OpenLayers.Bounds(-20037508.34,-20037508.34,20037508.34,20037508.34),
        numZoomLevels: 19,
        maxResolution: 156543,
        units: 'meters'
    });

    // inserted by livetiles.wsgi
    var mapstyles = %MAPSTYLES%;

    if (window.location.pathname[window.location.pathname.length-1] != "/") {
      baseurl=window.location.pathname+"/";
    } else {
      baseurl=window.location.pathname;
    };

    if (mapstyles.length >1) {
      for (var i in mapstyles) {
        map.addLayer(new OpenLayers.Layer.XYZ(mapstyles[i],baseurl+mapstyles[i]+'/${z}/${x}/${y}.png'));
      };
      ls=new OpenLayers.Control.LayerSwitcher();
      map.addControl(ls);
      ls.maximizeControl();
    } else {
      map.addLayer(new
      OpenLayers.Layer.XYZ(mapstyles[0],baseurl+'${z}/${x}/${y}.png'));
    }
    
    if (!map.getCenter()) {
      var lonlat = new OpenLayers.LonLat(lon, lat);
      lonlat.transform(proj4326, projmerc);
      map.setCenter(lonlat, zoom);
    };    
};

//]]>
    </script>
  </head>
  <body onload=drawmap();>
  <div id="map"></div>
</BODY>
</HTML>
  
